<template>
    <div>
        <div :class="[active == 0 ? 'rand1' : 'rand2', 'rand']">
            <!-- <van-tabs v-model="active">
                <van-tab title="人气达人榜" name="a">
                    <Hot></Hot>
                </van-tab>
                <van-tab title="任务达人榜" name="b">
                    <Award></Award>
                </van-tab>
            </van-tabs> -->
            <header id="header" class="aui-bar aui-bar-nav">
                <a class="aui-pull-left" @click="back">
                    <span class="iconfont icon-fanhui"></span>
                </a>
                <div class="aui-title title1">
                    <div class="tab">
                        <span :class="[active == 0 ? 'active' : '']" @click="fnChangeTab(0)">邀请达人榜</span>
                        <span :class="[active == 1 ? 'active' : '']" @click="fnChangeTab(1)" v-if="show_sy">试用达人榜</span>
                    </div>
                </div>
            </header>
            <Hot :show="active == 0 ? true : false"></Hot>
            <Award :show="(active == 1 ? true : false) && show_sy"></Award>
        </div>
    </div>
</template>
<script>
import "@/styles/phb.css"
import Hot from './components/hot.vue'
import Award from './components/award.vue'
export default {
    components: {
        Hot,
        Award
    },
    data () {
        return {
            active: 0,
            show_sy: false
        }
    },
    mounted() {
        this.fnChangeTab(parseInt(this.$route.params.index))
        this.show_sy = this.$route.params.show;
    },
    methods: {
        fnChangeTab (index) {
            this.active = index;
        }
    }
}
</script>